<template>
  <div>
    <div class="wxNotice">
      <div class="header flex-justify-between">
        <div style="display: flex; gap: 5px">
          <HPlainButton @click="onShowUpgrade">同步消息模版</HPlainButton>
          <HPlainButton @click="onShowUpgrade">导出</HPlainButton>
        </div>
        <div class="search">
          <el-select v-model="value" @change="onShowUpgrade" class="el-select" placeholder="请选择" filterable clearable>
            <el-option v-for="item in options" :key="item.value" :value="item.value"
          /></el-select>
          <el-select v-model="value" @change="onShowUpgrade" class="el-select" placeholder="请选择" filterable clearable>
            <el-option v-for="item in options" :key="item.value" :value="item.value"
          /></el-select>
          <el-input v-model="input" @clear="onShowUpgrade" @keyup.enter="onShowUpgrade" clearable placeholder="搜索" class="input-with-select"></el-input>
          <div style="margin-left: 5px">
            <HButton type="primary" @click="onShowUpgrade">
              <el-icon>
                <Search></Search>
              </el-icon>
              搜索
            </HButton>
          </div>
        </div>
      </div>
      <div class="el-table">
        <el-table border stripe resizable :data="tableData">
          <el-table-column
            show-overflow-tooltip
            type="index"
            :index="indexMethod"
            label="序号"
            width="50"
          />
          <el-table-column show-overflow-tooltip prop="pageName" label="事件名称" width="150" />
          <el-table-column show-overflow-tooltip prop="pageType" label="事件模块" width="150" />
          <el-table-column show-overflow-tooltip prop="pageName" label="接收角色" width="150" />
          <el-table-column show-overflow-tooltip prop="pageName" label="模版名称" width="150" />
          <el-table-column show-overflow-tooltip prop="pageType" label="消息内容" />
          <el-table-column show-overflow-tooltip prop="pageName" label="状态" width="128">
            <template #default="scope">
              <span>{{ scope.row.pageName }}</span>
            </template>
          </el-table-column>
          <el-table-column fixed="right" label="操作" width="60">
            <HLink @click="onShowUpgrade">修改</HLink>
          </el-table-column>
        </el-table>
      </div>
      <!-- <div class="footer">
        <div class="pagina"> <Pagination /></div>
      </div> -->
    </div>
  </div>
</template>

<script setup lang="ts">
  import { ref } from 'vue'
  import { Search } from '@element-plus/icons-vue'
  import HPlainButton from '@/components/common/button/HPlainButton.vue'
  import HLink from '@/components/common/link/HLink.vue'
  import { ElMessage } from 'element-plus'
  import HButton from '@/components/common/button/HButton.vue'

  /**
   * 显示升级维护方法
   */
  const onShowUpgrade = () => {
    ElMessage({
      type: 'success',
      message: '正在升级维护中，敬请期待',
    })
  }

  //列表序号
  const indexMethod = (index: number) => {
    return (index + 1) * 1
  }

  const input = ref('')
  const value = ref('')
  const options = [
    {
      value: '全部类型',
    },
    {
      value: '全部品牌',
    },
    {
      value: '全部分类',
    },
  ]

  const tableData = [
    {
      id: 12,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '仓储网点登录页面',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcSciao/#/?custaccid=1',
      pageTitle: '仓储网点登录页面',
      pageStatus: 0,
      pageSelectLcon: 0,
      pageLcon: '',
      pageSelectStyle: 2,
      pageQrTitle: '自助服务申请',
      pageQrProgramme: '扫一扫 立刻快速报装报修',
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-07-05 11:23:44',
      isDelete: 0,
      systemModuleNo: 50,
    },
    {
      id: 13,
      custAccId: 1,
      pageCreateByEmpId: 1,
      pageName: '安装',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/reqWorkor/add?type=1',
      pageTitle: '安装',
      pageStatus: 1,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-27 10:07:47',
      pageUpdateTime: '2023-06-27 10:07:47',
      isDelete: 0,
      systemModuleNo: 10,
    },
    {
      id: 11,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '服务网点登录页面',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcOutlets/#/?custaccid=1',
      pageTitle: '服务网点登录页面',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 20,
    },
    {
      id: 10,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '服务工单',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/index/wor?typeNum=0&custaccid=1',
      pageTitle: '服务工单',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 10,
    },
    {
      id: 9,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '我的产品',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/index/product?typeNum=0&custaccid=1',
      pageTitle: '我的产品',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 10,
    },
    {
      id: 8,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '登录页面',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/login?custaccid=1',
      pageTitle: '登录页面',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 30,
    },
    {
      id: 7,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '说明书',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/inma?custaccid=1',
      pageTitle: '说明书',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 90,
    },
    {
      id: 6,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '产品视频',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/video?custaccid=1',
      pageTitle: '产品视频',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 90,
    },
    {
      id: 5,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '配件价格',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/sprice?custaccid=1',
      pageTitle: '配件价格',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 110,
    },
    {
      id: 4,
      custAccId: 1,
      pageCreateByEmpId: null,
      pageName: '进度查询',
      pageType: '移动端',
      pageUrl: 'https://demo.1688-yun.com/xcMobile/#/scheSl?custaccid=1',
      pageTitle: '进度查询',
      pageStatus: 0,
      pageSelectLcon: null,
      pageLcon: null,
      pageSelectStyle: null,
      pageQrTitle: null,
      pageQrProgramme: null,
      pageCreateTime: '2023-06-26 16:59:42',
      pageUpdateTime: '2023-06-26 16:59:42',
      isDelete: 0,
      systemModuleNo: 10,
    },
  ]
</script>

<style scoped lang="scss">
  @import '../../index.scss';
</style>
